html,
    body {
      width: 600px;
      height: 350px;
      padding: 0;
      margin: 0;
      overflow: hidden;
      font-size: 12px;
      line-height: 30px;
      position: relative;
    }

    img {
      width: 100%;
      height: 350px;
      user-select: none;
      -webkit-app-region: no-drag;
    }

    #status-bar {
      width: 100%;
      height: 30px;
      background: rgba(255, 255, 255, .6);
      position: absolute;
      bottom: 0;
      left: 0;
      padding: 0 10px;
    }

    @Keyframes donut-spin {
      0% {
        transform: rotate(0deg);
      }

      100% {
        transform: rotate(360deg);
      }
    }

    .donut {
      line-height: 30px;
      display: inline-block;
      border: 4px solid #fff;
      border-left-color: #ccc;
      border-radius: 50%;
      width: 8px;
      height: 8px;
      animation: donut-spin 1.2s linear infinite;
      position: absolute;
      top: 20%;
    }

    .text {
      position: absolute;
      left: 35px;
      line-height: 30px;
    }
